﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>注册页</title>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
    <link href="../css/global.css" rel="stylesheet" type="text/css" />
    <link href="css/register.css" rel="stylesheet" type="text/css" />
</head>
<body class="member-reg">
    <div id="header">
    </div>
    <div id="container">
        <div class="title">
            <h6 class="title-bar">
                <span class="th">用户注册</span></h6>
        </div>
        <div id="main">
            <div id="reg_form" class="left">
                <form>
                <ul>
                    <li>
                        <label class="th">
                            用户名<em>*</em></label><input type="text" id="username" ajaxcheck="" placeholder="请输入用户名！"
                                pattern="[a-zA-Z0-9-_]{5,15}" class="inp-box" style="width: 180px" focushtml="6-16个字符或数字（a-z,0-9,_）"
                                name="" showdom="tip_user" errorhtml="用户名格式不正确！" /><span class="vali_tip" id="tip_user"></span></li>
                    <li>
                        <label class="th">
                            密码<em>*</em></label><input type="password" id="pass" class="inp-box" style="width: 180px"
                                pattern="[a-zA-Z0-9_]{6,18}" focushtml="6-18个字符或数字的组合（a-z,0-9,_）" errorhtml="密码格式不正确！"
                                showdom="tip_pass" name="" /><span class="vali_tip" id="tip_pass"></span></li>
                    <li>
                        <label class="th">
                            再次输入密码<em>*</em></label><input type="password" id="repass" equalto="pass" showdom="tip_repass"
                                focushtml="请再输入一遍密码！" errorhtml="两次密码输入不一致！" class="inp-box" style="width: 180px"
                                name="" /><span class="vali_tip" id="tip_repass"></span></li>
                    <li>
                        <label class="th">
                            输入验证码<em>*</em></label><input type="text" class="inp-box" style="width: 60px" name="" /><img
                                src="" id="verifycode" alt="验证图片" /><a href="">看不清？</a></li>
                    <li>
                        <input type="button" id="sub_reg" value="" /></li>
                    <li><a href="" title="" target="_blank">华股网服务条款</a></li>
                </ul>
                </form>
            </div>
            <div id="reg_info_tip" class="right">
            </div>
            <div class="clear">
            </div>
        </div>
    </div>
    <div id="footer">
    </div>

    <script language="javascript" type="text/javascript" src="../js/jquery1.3.2.min.js"></script>

    <script language="javascript" type="text/javascript" src="../js/jquery.validate.js"></script>

    <script language="javascript" type="text/javascript">
        $(function() {
            var inpBox = $("#reg_form").find("input.inp-box");
            $("#username").validate({
                ajaxCheck: function(data) {
                    var input = data.dom;
                    var inpVal = data.value;
                    var tipLayer = data.showDOM;
                    var defaultClass = data.defaultClass;
                    var errorClass = data.errorClass;
                    var correctHTML = data.correctHTML;
                    var correctClass = data.correctClass;
                    tipLayer.attr("class", "").addClass(defaultClass + " vali_ajax").html("正在检测用户名是否可用...");
                    //异步验证
                }
            });
            inpBox.focus(function() {
                $(this).parent().addClass("focus");
            });
            inpBox.blur(function() {
                $(this).parent().removeClass("focus");
            });
            $("#sub_reg").click(function() {
                var across;
                for (var i = 0, j = inpBox.length; i < j; i++) {
                    if (!inpBox.eq(i).data("cache").across) {
                        across = false;
                    }
                }
                if (!across) {
                    alert("no");
                } else {
                    alert("yes");
                }

            });
        });
    </script>

</body>
</html>
